﻿<Page
    x:Name="PageRoot"
    x:Class="LiveConnectExample.ContactPage"
    DataContext="{Binding DefaultViewModel, RelativeSource={RelativeSource Self}}"
    xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
    xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
    xmlns:local="using:LiveConnectExample"
    xmlns:common="using:LiveConnectExample.Common"
    xmlns:d="http://schemas.microsoft.com/expression/blend/2008"
    xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006"
    mc:Ignorable="d">

    <Page.Resources>
        <x:String x:Key="ChevronGlyph">&#xE26B;</x:String>
        <common:BooleanToVisibilityConverter x:Key="IfTrueThenVisible" TrueValue="Visible"/>
        <common:BooleanToVisibilityConverter x:Key="IfFalseThenVisible" TrueValue="Collapsed"/>
        <local:SkyDriveItemToIconUriConverter x:Key="SkyDriveItemToIconUriConverter"/>
    </Page.Resources>

    <!--
        This grid acts as a root panel for the page.
    -->
    <Grid Background="{ThemeResource ApplicationPageBackgroundThemeBrush}">
        <Grid.ChildrenTransitions>
            <TransitionCollection>
                <EntranceThemeTransition/>
            </TransitionCollection>
        </Grid.ChildrenTransitions>

        <Hub>
            <Hub.Header>
                <!-- Back button and page title -->
                <Grid>
                    <Grid.ColumnDefinitions>
                        <ColumnDefinition Width="80"/>
                        <ColumnDefinition Width="*"/>
                    </Grid.ColumnDefinitions>
                    <Button x:Name="BackButton" Margin="-1,-1,39,0" Command="{Binding NavigationHelper.GoBackCommand, ElementName=PageRoot}"
                        Style="{StaticResource NavigationBackButtonNormalStyle}"
                        VerticalAlignment="Top"
                        AutomationProperties.Name="Back"
                        AutomationProperties.AutomationId="BackButton"
                        AutomationProperties.ItemType="Navigation Button"/>
                    <TextBlock x:Name="PageTitle" Text="{StaticResource AppName}" Style="{StaticResource HeaderTextBlockStyle}" Grid.Column="1" 
                        IsHitTestVisible="false" TextWrapping="NoWrap" VerticalAlignment="Top"/>
                </Grid>
            </Hub.Header>

            <HubSection Width="320" Margin="0,0,80,0" Header="{Binding Contact.name}" Visibility="{Binding IsConnected, Converter={StaticResource IfTrueThenVisible}}">
                <HubSection.Background>
                    <ImageBrush Stretch="UniformToFill" />
                </HubSection.Background>
                <DataTemplate>
                    <Grid>
                        <Grid.ColumnDefinitions>
                            <ColumnDefinition Width="Auto"/>
                            <ColumnDefinition Width="5"/>
                            <ColumnDefinition Width="*"/>
                        </Grid.ColumnDefinitions>
                        <Grid.RowDefinitions>
                            <RowDefinition Height="Auto"/>
                            <RowDefinition Height="Auto"/>
                            <RowDefinition Height="Auto"/>
                            <RowDefinition Height="Auto"/>
                            <RowDefinition Height="*"/>
                        </Grid.RowDefinitions>
                        <Grid.Resources>
                            <Style TargetType="TextBlock" BasedOn="{StaticResource BaseTextBlockStyle}">
                                <Setter Property="Margin" Value="5"/>
                            </Style>
                            <Style TargetType="HyperlinkButton" BasedOn="{StaticResource TextBlockButtonStyle}">
                                <Setter Property="Margin" Value="5"/>
                            </Style>
                        </Grid.Resources>
                        <Image Grid.Row="0" Grid.Column="0" Grid.ColumnSpan="99" Source="{Binding ImageSource}" Width="180" Height="180" Margin="0,20,0,20" />
                        <TextBlock Grid.Row="1" Grid.Column="0" Text="Id: "/>
                        <TextBlock Grid.Row="1" Grid.Column="2" Text="{Binding Contact.id}"/>

                        <TextBlock Grid.Row="3" Grid.Column="0" Grid.ColumnSpan="99" Text="Additional Values:"/>
                        <ScrollViewer Grid.Row="4" Grid.Column="0" Grid.ColumnSpan="99" VerticalScrollBarVisibility="Auto" Margin="5">
                            <ItemsControl ItemsSource="{Binding AdditionalDetails}">
                                <ItemsControl.ItemTemplate>
                                    <DataTemplate>
                                        <StackPanel Orientation="Horizontal">
                                            <TextBlock Text="{Binding Key}"/>
                                            <TextBlock Text=" - "/>
                                            <TextBlock Text="{Binding Value}"/>
                                        </StackPanel>
                                    </DataTemplate>
                                </ItemsControl.ItemTemplate>
                            </ItemsControl>
                        </ScrollViewer>
                    </Grid>
                </DataTemplate>
            </HubSection>

            <HubSection Header="Skydrive" Visibility="{Binding IsConnected, Converter={StaticResource IfTrueThenVisible}}">
                <DataTemplate>
                    <GridView x:Name="SkydriveListing"
                              ItemsSource="{Binding ElementName=PageRoot, Path=DataContext.SkydriveItems}"
                              AutomationProperties.AutomationId="SkydriveListing"
                              AutomationProperties.Name="Items"
                              TabIndex="1"
                              SelectionMode="None"
                              IsSwipeEnabled="false"
                              IsItemClickEnabled="True"
                              ItemClick="HandleSkyDriveItemClicked">
                        <GridView.ItemTemplate>
                            <DataTemplate>
                                <Grid Margin="6">
                                    <Grid.ColumnDefinitions>
                                        <ColumnDefinition Width="60"/>
                                        <ColumnDefinition Width="190"/>
                                    </Grid.ColumnDefinitions>
                                    <Border Background="{ThemeResource ListViewItemPlaceholderBackgroundThemeBrush}" Width="60" Height="60">
                                        <Image Source="{Binding Converter={StaticResource SkyDriveItemToIconUriConverter}}" Stretch="UniformToFill" AutomationProperties.Name="{Binding Title}"/>
                                    </Border>
                                    <StackPanel Grid.Column="1" Margin="10,0,0,0">
                                        <TextBlock Text="{Binding name}" Style="{StaticResource TitleTextBlockStyle}" TextWrapping="NoWrap" MaxHeight="40"/>
                                        <TextBlock Text="{Binding id}" Style="{StaticResource CaptionTextBlockStyle}" TextWrapping="NoWrap"/>
                                    </StackPanel>
                                </Grid>
                            </DataTemplate>
                        </GridView.ItemTemplate>
                    </GridView>
                </DataTemplate>
            </HubSection>

            <HubSection Visibility="{Binding IsConnected, Converter={StaticResource IfFalseThenVisible}}">
                <DataTemplate>
                    <TextBlock>
                        To use this example, make sure the current user is signed in...
                    </TextBlock>
                </DataTemplate>
            </HubSection>
        </Hub>
    </Grid>
    <Page.BottomAppBar>
        <CommandBar>
            <AppBarButton Icon="Refresh" Label="Refresh" Command="{Binding RefreshCommand}"/>
        </CommandBar>
    </Page.BottomAppBar>
</Page>
